<div style="height: 100%; width: 100%; display: flex; flex-direction: column">
    <div>
        <div style="margin-bottom: 5px; min-height: 30px">
            <button onclick="reverseItems()">Reverse</button>
            <button onclick="addFiveItems(true)">Append</button>
            <button onclick="addFiveItems(false)">Prepend</button>
            <button onclick="removeSelected()">Remove Selected</button>
            <button onclick="updatePrices()">Update Prices</button>
        </div>
        <div style="margin-bottom: 5px; min-height: 30px">
            <button id="groupingOn" onclick="onGroupingEnabled(true)">Grouping On</button>
            <button id="groupingOff" onclick="onGroupingEnabled(false)">Grouping Off</button>
            <button onclick="setSelectedToGroup('A')">Move to Group A</button>
            <button onclick="setSelectedToGroup('B')">Move to Group B</button>
            <button onclick="setSelectedToGroup('C')">Move to Group C</button>
        </div>
    </div>
    <div style="flex: 1 1 0px">
        <div id="myGrid" style="height: 100%"></div>
    </div>
</div>
